<template>
  <view class="cartbox">
    <my_addr></my_addr>
    <view class="titleh">
      <uni-icons type="shop" size="20"></uni-icons>
      <text>购物车</text>
    </view>
    <view class="" v-for="(item,index) in cartList" :key="index">
      <uni-swipe-action>
        <uni-swipe-action-item :right-options="options" @click="delgoods(item)">
              <mycartInfo :goods="item" @change_radio="changhandler" @numchange="numhandler"></mycartInfo>
        </uni-swipe-action-item>
      </uni-swipe-action>

    </view>
    <view class="cart-total-box">
      <cartTotal></cartTotal>
    </view>
  </view>
</template>

<script>
import badge from '../../mixin/tabbar-badge.js'
import {mapState,mapMutations} from 'vuex'
  export default {
    mixins:[badge],
    computed:{
      ...mapState('myCart',['cartList']),
      },
    data() {
      return {
        options:[{
          text:'删除',
          style:{
            backgroundColor:'#f10250'
          }
        }]
      };
    },
    methods:{
      ...mapMutations('myCart',['updateState','updatenum','removeCartBytId']),
      changhandler(e){
    
        this.updateState(e)
      },
      numhandler(e){
        this.updatenum(e)
      },
      delgoods(item){
        this.removeCartBytId(item)
       
      }
      
    }
  
  }
</script>

<style lang="scss">
  .cartbox{
    padding-bottom:40px ;
  }
.titleh{
  display: flex;
  height: 40px;
  padding: 0 5px;
align-items: center;
text{
  margin-right: 20px;
  font-size: 12px;
}
}
.cart-total-box{
  height: 40px;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0 10px;
   background-color: cyan;
}
</style>
